<template>
	<view class="pb120">
		<view class="pr">
			<image src="/static/img/release/bg1.png" class="w-max pa top0 left0 h-max"></image>
			<u-navbar :is-back="false" :border-bottom="false" is-fixed :title="data.name" title-color="#fff"
				:background="{background:'#fff0'}">
				<view class="w20" />
				<back />
			</u-navbar>
			<view class="h100"></view>
		</view>
		<view class="m20 bg-fff radius20 py24 px28 flex row-between pr" style="margin-top: -70rpx;">
			<view v-for="(item,index) in releaseStatus" :key="index" class="flex w25p row-center relative">
				<view class="text-center ">
					<image :src="item.img" class="h88 w88" mode=""></image>
					<view class="fs28 color-00111d">
						{{item.name}}
					</view>
				</view>
				<view class="line absolute -right-10 top44" v-if="index<releaseStatus.length-1">
				</view>
			</view>
		</view>

		<u-form ref="uForm" label-width="auto" :label-style="{color: '#666'}">
			<view class="m20 bg-fff radius20  px20 ">
				<view v-for="(item,index) in data.items" :key="index" :class="item.class||''">
					<u-form-item :label="item.name" :rightIcon="item.right?'arrow-right':''"
						:labelPosition="item.labelPosition||''">
						<view class="flex row-right w-max" v-if="item.isImg">
							<imgList :width="item.width" :height="item.height" :size="item.size||180" :src="item.src"
								:max="item.max||1" :hideBor="item.hideBor" @success="setImg(item,$event)" />
							<view class="color-fs fs28 text-vertical ml20" v-if="item.shili"
								@click="$tool.lookImg([item.shiliSrc])">示 例</view>
						</view>
						<view class="flex row-right w-max" v-else-if="item.isNumber">
							<u-number-box v-model="item.value" :min="item.number_min||0"></u-number-box>
						</view>
						<u-input v-else :inputAlign="item.inputAlign||'right'" :clearable="false" :type="item.form_type"
							:selectOpen="item.show" v-model="item.value" :placeholder="item.placeholder"
							:disabled="item.disabled" @click="click(item)" :maxlength="item.maxlength||100"
							:border="item.inputBorder||false" />

					</u-form-item>
					<block v-if="item.list">
						<u-select v-model="item.show" :list="item.list" @confirm="confirm(item,$event)"
							:title="item.placeholder" mode="mutil-column-auto" :num="item.listNum||''" />
					</block>
					<block v-if="item.field=='expect_time'">
						<u-picker mode="time" v-model="item.show" :params="item.timeParams"
							@confirm="confirmPicker(item,$event)" />
					</block>
				</view>
			</view>
			<view class="m20 bg-fff radius20  px20 py24">
				<view class="color-fs">注意事项：</view>
				<view class="color-666 mt20 fs26 lh15">{{data.note}}</view>
			</view>
		</u-form>
		<view class="fixed bottom0 bg-fff px40 w-max z-index2 pt20 pb10">
			<view class="flex row-center">
				<u-checkbox v-model="is" size="28" :activeColor="$zs" shape="circle" />
				<view class="color-666 fs26" id="is">我已认真阅读相关预约
					<text class="color-zs"
						@click="$u.route('/pages/public/text',{text:'service_agreement',tit:'用户服务协议'})">《服务条款同意书》</text>
				</view>
			</view>
			<view class="h20"></view>
			<u-button type="warning" ripple @click="submit">立即下单</u-button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				is: true,
				releaseStatus: [{
						name: '发起需求',
						img: '/static/img/release/fqxq.png'
					},
					{
						name: '在线支付',
						img: '/static/img/release/bj.png'
					},
					{
						name: '服务中',
						img: '/static/img/release/fwz.png'
					},
					{
						name: '完工评价',
						img: '/static/img/release/wgpj.png'
					},
				],

				data: '',
				
			};
		},
		onLoad(e) {
			e.type = e.type || 1
			if (e.organ_id || e.master_id) e.type = 2
			this.$params = e
			this.orderInfo()
		},
		watch: {
			hospitalShow(e) {
				this.$emit('setHospital', e)
			}
		},
		methods: {
			submit() {
				let form = {
					city_id: this.$getCache('myAdd').id || "",
					...this.$params,
				}
				if (!this.is) return this.$msg('请同意协议')
				let aa = this.data.items.find(item => {
					form[item.field] = item.value_id || item.value || ''
					
					return item.required&&form[item.field] == ''
				})
				console.log(JSON.parse(JSON.stringify(form)));
				if (aa) return this.$msg(aa.placeholder)
				this.$request('/member/index/createOrder', form).then(res => {
					this.$msg(res.msg)
					if (res.data.type == 0) {
						setTimeout(() => {
							this.$u.route({
								url: '/pages/orderList/orderList',
								type: 'switchTab'
							})
						}, 1000)
						return
					}
					this.$u.route('/pages/index/demo/pay', res.data)
				})
			},
			click(item) {
				item.click(item)
			},
			orderInfo() {
				this.$request('/member/index/orderInfo', this.$params).then(res => {
					let data = res.data
					this.$tool.setTit(data.name)
					console.log(data);
					data.items.forEach(item => {
						item.form_type = item.form_type || 'text' //表单类型
						item.value = item.value || '' //表单v-mode
						item.value_id = item.value_id || '' //
						item.disabled = false
						item.required = true
						item.click = () => {}
						switch (item.field) {
							case 'patient_id':
								item.right = true
								item.disabled = true
								item.click = this.set_patient
								break;
							case "relation":
								item.form_type = 'select'
								item.disabled = true
								item.show = false
								item.list = data.relation_arr.map(label => {
									return {
										label,
									}
								})
								item.click = () => {
									item.show = true
								}
								break;
							case 'hospital_id':
								item.form_type = 'select'
								item.disabled = true
								item.show = false
								item.list = []
								item.click = this.getHospital
								if (this.$params.hospital_id) {
									item.class = "pe-none"
									// this.getHospital(item, false)
								}
								item.change = (old, newData) => {
									if (old.value_id != newData.value_id) {
										this.$emit('hospital_change')
									}
								}
								break;
							case 'department': //"科室"
								item.form_type = 'select'
								item.disabled = true
								item.show = false
								item.list = []
								item.click = this.getDep
								item.listNum = 2
								this.$on('hospital_change', data => {
									console.log(1);
									item.list = []
									item.value = ''
									item.value_id = ''
								})
								break;
							case 'expect_time':
								item.form_type = 'select'
								item.disabled = true
								item.timeParams = {
									year: true,
									month: true,
									day: true,
									hour: true,
									minute: true,
									second: false
								}
								item.show = false
								item.click = () => item.show = !item.show
								break;
							case 'mobile':
								item.form_type = 'number'
								item.maxlength = 11
								break;
							case 'remarks':
								item.form_type = 'textarea'
								item.placeholder = '若有其它服务需求，请在此备注说明'
								item.labelPosition = 'top'
								item.inputAlign = 'left'
								item.inputBorder = true
								item.required=false
								break;
							case 'address_id':
								item.right = true
								item.disabled = true
								item.click = this.set_address
								break;
							case 'qr_code':
								item.isImg = true
								// item.src = '/static/img/release/1.png'
								// item.hideBor = true
								// item.width = 140
								// item.height = 76
								item.shili = true
								item.shiliSrc = '/static/img/release/1.png'
								break;
							case 'bar_code':
								item.isImg = true
								// item.src = '/static/img/release/2.png'
								// item.hideBor = true
								// item.width = 100
								// item.height = 120
								item.shili = true
								item.shiliSrc = '/static/img/release/2.png'
								break;
							case 'report_type':
								item.form_type = 'select'
								item.disabled = true
								item.show = false
								item.list = data.report_type_arr.map(label => {
									return {
										label,
									}
								})
								item.click = () => {
									item.show = true
								}
								break;
							case 'drugs_type':
								item.form_type = 'select'
								item.disabled = true
								item.show = false
								item.list = [{
									label: '非处方药',
									value: '0'
								}, {
									label: '处方药',
									value: 1
								}, ]
								item.click = () => {
									item.show = true
								}
								break;
							case 'prescription':
								item.isImg = true
								item.size = 150
								break;
							case 'days':
								item.isNumber = true
								item.value = 1
								item.number_min = 1
								break;
							case 'patient_id':

								break;
							case 'drugs_type':

								break;
							default:
								break;
						}
						if (item.disabled) item.placeholder = '请选择' + item.name
						item.placeholder = item.placeholder || '请输入' + item.name
					})
					this.data = data
					console.log(JSON.parse(JSON.stringify(data.items)));
				})
			},
			confirmPicker(item, e) {
				item.value = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute
			},
			setImg(item, ids) {
				item.value = ids
			},
			confirm(item, list) {
				let old = JSON.parse(JSON.stringify(item))
				let arr = list.reverse()
				let aa = arr.find(it => it.label)
				item.value = aa.label
				item.value_id = aa.value || ''
				item.change && item.change(old, item)
			},
			set_address(item) { //设置地址
				uni.$off('set_address')
				uni.$once('set_address', data => {
					item.value_id = data.id
					item.value = data.name
				})
				this.$u.route('/pages/my/address/address', {
					sel: 1
				})
			},
			set_patient(item) {
				uni.$off('set_patient')
				uni.$once('set_patient', data => {
					item.value_id = data.id
					item.value = data.name
				})
				this.$u.route('/pages/my/addPatient/patientList', {
					sel: 1
				})
			},
			getHospital(item, show = true) {
				// console.log(item, show);
				if (item.list.length) return item.show = show
				let params = {
					...this.$params,
					city_id: this.$getCache('myAdd').id || "",
					type: '1', //获取科室
				}
				if (!params.city_id) {
					this.$msg('请设置城市')
					setTimeout(() => {
						this.$u.route('/pages/index/chooseAddress/chooseAddress')
					}, 1000)
					return
				}
				this.$request('/master/commom/getHospital', params).then(res => {
					item.hospital = res.data
					item.list = res.data.map(item => {
						let aa = {
							label: item.name,
							value: item.id,
						}
						return aa
					})
					item.show = show
				})
			},
			getDep(item) {


				let hospital = this.data.items.find(it => it.field == 'hospital_id')
				console.log(hospital);
				if (!hospital) return console.log('没找到医院');
				if (!hospital.value_id) return this.$msg('请先选择医院')

				let params = {
					hospital_id: hospital.value_id || "",
					type: '1', //获取科室
				}
				if (item.list.length) return item.show = true
				this.$request('/master/commom/getDepartment', params).then(res => {
					item.list = res.data.data
					item.show = true
				})

				// let hospital_item = hospital.hospital?.find(it => it.id == hospital.value_id) || '' //获取选中的医院

				// item.list = hospital_item.department.map(item => {
				// 	let aa = {
				// 		label: item.name,
				// 	}
				// 	return aa
				// })
				// item.show = true
			},
		},
	}
</script>

<style lang="scss">
	.line {
		width: 70rpx;
		height: 0rpx;
		border: 1rpx dashed #72dbde;
	}

	.-right-10 {
		right: -35rpx;
	}

	.pb120 {
		padding-bottom: 200rpx;
	}
</style>
